<template>
	<view class="container">
		<view class="form-rows f-a-center">
			<view class="rows-label f-c-between">
				<span>姓</span><span>名：</span>
			</view>
			<u--input v-model.trim="params.realname" clearable color="#5D6168" fontSize="28rpx" placeholder="请输入姓名"
				border="none" :customStyle="{paddingLeft:'30rpx'}"></u--input>
		</view>
		<!-- <u-gap height="1" bgColor="#E8E8E8"></u-gap> -->
		<view class="form-rows f-a-center">
			<view class="rows-label">身份证号：</view>
			<u--input v-model.trim="params.idcard" type="number" clearable color="#5D6168" fontSize="28rpx"
				placeholder="请输入身份证号" border="none" :customStyle="{paddingLeft:'30rpx'}"></u--input>
		</view>
		<u-gap height="12rpx" bgColor="#FAFAFA"></u-gap>

		<view class="idcard-list">
			<view class="title">请上传自拍照</view>
			<image :src="params.image||'/static/mine/user-photo.png'" mode="widthFix" class="idcard-img" @click="uploadIdCard('image')">
			</image>
			<!--<view class="title">请上传身份证国徽面</view>
			<image :src="params.back_image||'/static/mine/idcard-back.png'" class="idcard-img"
				@click="uploadIdCard('back_image')">
			</image> -->
		</view>

		<view class="footer-fixed">
			<button class="btn-submit" @click="btnUserAuth">提交认证</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				params: {
					realname: '',
					idcard: '',
					image: '',
					back_image: '',
				}
			}
		},
		onLoad() {
			this.getUserAuthInfo()
		},
		methods: {
			//获取认证信息
			getUserAuthInfo() {
				this.$store.dispatch('get_authUserRealInfo').then(res => {
					if (res) {
						this.params = res
					}
				})
			},

			//上传图片
			uploadIdCard(type) {
				this.$util.fileUtil.chooseImageUpload().then(resList => {
					this.params[type] = resList[0].fullurl
				})
			},

			//用户认证
			btnUserAuth() {
				let {
					realname,
					idcard,
					image,
					// back_image
				} = this.params
				if (!realname.trim()) {
					this.$showToast('请填写姓名')
					return
				}
				if (!idcard.trim()) {
					this.$showToast('请填写身份证号')
					return
				}
				if (!image) {
					this.$showToast('请上传自拍照')
					return
				}
				this.$api.auth_user_info({
					realname,
					idcard,
					image,
					// back_image
				}).then(res => {
					this.$showToast('提交成功，等待审核')
					setTimeout(() => {
						uni.navigateBack()
					}, 1000)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		padding: 20rpx 36rpx 200rpx;

		.form-rows {
			height: 106rpx;
			border-bottom: 1px solid #f1f1f1;

			.rows-label {
				width: 170rpx;
				font-weight: 400;
				font-size: 34rpx;
				color: #51565D;
			}
		}
	}

	.idcard-list {
		.title {
			font-weight: 400;
			font-size: 32rpx;
			color: #51565D;
			padding: 30rpx 0 20rpx;
		}

		.idcard-img {
			width: 100%;
			// height: 442rpx;
			border-radius: 10rpx;
		}
	}

	.footer-fixed {
		padding: 16rpx 36rpx;
		background-color: #ffffff;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;

		.btn-submit {
			height: 76rpx;
			line-height: 76rpx;
			background: #FFC046;
			border-radius: 38rpx;
			font-weight: 400;
			font-size: 32rpx;
			color: #FFFFFF;
		}
	}
</style>